import 'package:flutter/material.dart';

class AppBar_ extends StatefulWidget {
  const AppBar_({Key? key}) : super(key: key);

  @override
  State<AppBar_> createState() => _AppBarState();
}

class _AppBarState extends State<AppBar_> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text('appBar(应用栏组件)'),
        backgroundColor: Colors.red,
        bottom: Tab(
          child: ListView(
            scrollDirection: Axis.horizontal,
            children: [
              Icon(Icons.construction),
              Icon(Icons.construction),
              Icon(Icons.construction),
              Icon(Icons.construction),
              Text('Tab导航栏Tab导航栏Tab导航栏Tab导航栏Tab导航栏',style: TextStyle(height: 2.5,color: Colors.white,fontWeight: FontWeight.w600),),
              Icon(Icons.construction),
              Icon(Icons.construction),
              Icon(Icons.construction),
              Icon(Icons.construction),
              Icon(Icons.construction),
            ],
          ),
        ),
        actions: [TextButton(onPressed: (){
          Navigator.pop(context);
        }, child: Text('返回',style:TextStyle(color: Colors.white,fontSize: 20,),))],
        toolbarHeight: 60,
        toolbarOpacity: 1,
        toolbarTextStyle: TextStyle(height: 1,fontWeight: FontWeight.w900),
        iconTheme: IconThemeData(color: Colors.white),
        leadingWidth: 55,
      ),
      drawer: Drawer(
        width: 300,

        child: Container(
          color: Colors.blue,
          child: Column(
            children: [
              Text('\n左侧边栏',style: TextStyle(color: Colors.white,height: 2,fontSize: 20),),
              Container(
                margin: EdgeInsets.only(top: 25),
                color: Colors.white,
                child: ListTile(
                  onTap: (){
                    Navigator.pushNamed(context, 'home');
                  },
                    title: Text('主页'),
                    leading: CircleAvatar(
                      backgroundColor: Colors.white,
                      child:Icon(Icons.home,color: Colors.black,),
                    )
                ),
              ),
              Text('Scaffold()的内部写入drawer:Drawer()即可')
            ],
          ),
        )
      ),
      endDrawer: Drawer(
        width: 300,
        child:Container(
          color: Colors.yellow,
          child: Column(
            children: [
              Text('\n右侧边栏',style: TextStyle(color: Colors.white,height: 2,fontSize: 20),),
              Container(
                  margin: EdgeInsets.only(top: 25),
                  width: 300,
                  height: 55,
                  color: Colors.white,
                  child:OutlinedButton(
                    onPressed: (){
                      Navigator.pushNamed(context, 'home');
                    },
                    child:  Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Icon(Icons.home,color: Colors.black,),
                        Text('返回主页       ',style: TextStyle(color: Colors.black),)
                      ],
                    ),
                  )
              ),
              Text('Scaffold()的内部写入endDrawer:Drawer()即可')
            ],
          ),
        )
      ),
      body: Center(
          child: Column(
            children: [
              Text('应用栏组件用法：'),
              Text('在return Scaffold代码内部写入appBar:AppBar()即可'),
              Text('title:是应用栏的标题'),
              Text('backgroundColor:是改变应用栏的背景颜色'),
              Text('leading:是在最前面可以添加一个组件'),
              Text('actions:是在后面添加一些组件'),
              Text('toolbarHeight:是设置应用栏的高度'),
              Text('toolbarOpacity:是设置应用栏的字体透明度'),
              Text('toolbarTextStyle:是改变应用栏的主题字体'),
              Text('iconTheme:应用栏的第一个图标颜色改变'),
              Text('leadingWidth:应用栏的内部间距宽度'),
              Text('bottom:应用栏的Tab导航栏'),
              Text('centerTitle:应用栏标题是否居中'),
            ],
          )
      ),
    );
  }
}
